<template>
  <content id="content">
    <div id="flash">
      <h2>新品上线</h2>
      <ul>
        <!-- 已配置新品则显示配置内容 -->
        <!-- <li>
          <router-link to="showdetail"> <img
              src="https://newbee-mall.oss-cn-beijing.aliyuncs.com/images/mate-50-pro-black.png" style="height: 140px;"
              alt="【旗舰新品】HUAWEI/华为Mate50 Pro 昆仑破晓..." />
            <p class="name">【旗舰新品】HUAWEI/华为Mate50 Pro 昆仑破晓...</p>
            <p class="discount">曲面屏超光变XMAGE影像鸿蒙3.0拍照摄影...</p>
            <p class="item_price">7899</p>
          </router-link>
        </li> -->

        <!-- <router-link :to="{ path: '/user', query: { userId: '123' }}">用户信息</router-link> -->
        <li v-for="item in goods.newProduction.slice(0, 5)" :key="index">
          <router-link :to="{ path: '/showdetail', query: { goodsId: item.goodsId } }">
            <img :src="item.goodsCoverImg" style="height: 140px;" />
            <p class="name">{{ item.configName }}</p>
            <p class="discount">{{ item.goodsIntro.slice(0, 25) }}...</p>
            <p class="item_price">{{ item.sellingPrice }}</p>
          </router-link>
        </li>

      </ul>
    </div>

    <div id="recommend">
      <h2>为你推荐</h2>
      <a href="##" class="more"></a>
      <ul>
        <!-- 已配置推荐商品则显示配置内容 -->
        <!-- <li>
          <a href="/goods/detail/10931">
            <div class="info discount">强力出圈</div>
            <img src="https://newbee-mall.oss-cn-beijing.aliyuncs.com/images/iphone-14-pro-purple.jpg"
              alt="iPhone 14 Pro 暗紫色 512G" />
            <p class="name">iPhone 14 Pro 暗紫色 512G</p>
            <p class="item_price">10599</p>
            <p class="counter">猜你喜欢</p>
            <div class="comment">
              <p>小卖铺</p>
              <p>好物也可以不贵</p>
            </div>
          </a>
        </li> -->

        <li v-for="item in goods.yourLikes.slice(0, 10)" :key="index">
          <router-link :to="{ path: '/showdetail', query: { goodsId: item.goodsId } }">
            <div class="info discount">{{ item.tag }}</div>
            <img :src="item.goodsCoverImg" />
            <p class="name">{{ item.configName.slice(0, 20) }}</p>
            <p class="item_price">{{ item.sellingPrice }}</p>
            <p class="counter">猜你喜欢</p>
            <div class="comment">
              <p>只因商城</p>
              <p>好物也可以不贵</p>
            </div>
          </router-link>
        </li>

        <!-- 未配置则显示默认 -->
      </ul>
    </div>
  </content>
</template>

<script >
import "../assets/mall/css/swiper-bundle.min.css";
import "../assets/mall/css/iconfont.css";
import "../assets/mall/css/common.css";
import "../assets/mall/styles/header.css";
import "../assets/mall/styles/index.css";
import "../assets/admin/plugins/sweetalert2/sweetalert2.min.css";
import Store from '../stores/Store.js'
import axios from 'axios'

export default {
  data() {
    return {
      goods: Store()
    };
  },
  created() {
    axios.post("http://localhost:8080/goods/NewProductLaunch/1").then(resp => {
      this.goods.newProduction = resp.data
    })
    axios.post("http://localhost:8080/goods/NewProductLaunch/2").then(resp => {
      this.goods.yourLikes = resp.data
    })
  },
  methods: {

  }
};
</script>